<script setup lang="ts">
import { useCockpitScale } from './handle'
import type { CockpitSize } from './type'
// ------------------use------------------
// #region
const props = withDefaults(defineProps<CockpitSize>(), {
  width: 1920,
  height: 1080,
})
defineSlots<{
  default: (props: { scale: number }) => void
}>()
const { scale } = useCockpitScale(props)
// #endregion
// ------------------静态变量------------------
// #region

// #endregion
// ------------------动态变量------------------
// #region

// #endregion
// ------------------ref-----------
// #region

// #endregion
// ------------------reactive------
// #region

// #endregion
// ------------------computed------
// #region

// #endregion
// ------------------生命周期------------------
// #region

// #endregion
// ------------------内置方法---------------------
// #region

// #endregion
// ------------------方法---------------------
// #region

// #endregion
</script>

<template>
  <div
    class="height-vh width-vw cockpit-base"
    @contextmenu.prevent.stop
  >
    <slot :scale="scale" />
  </div>
</template>

<style lang="scss">
.cockpit-base {
  background-color: #000;
  /* 声明字体*/
  @font-face {
    font-family: electronicFont;
    src: url('@/assets/fonts/DS-DIGIT.TTF');
  }
}
</style>

<style lang="scss" scoped>
//------------------组件样式------------------

//-------------样式穿透-------------
</style>
